<template>
  <div>
    <a-list :item-layout="setting.options.needPicture?'vertical':'horizontal'" :data-source="listData">
      <template #renderItem="{ item }">
        <a-list-item>
          <!-- <template #extra>
          <img
            width="272"
            alt="logo"
            :src="item[setting.options.pictureSrc]?item[setting.options.pictureSrc]:'https://gw.alipayobjects.com/zos/rmsportal/mqaQswcyDLcXyDKnZfES.png'"
            v-show="setting.options.needPicture"
            :style="{height:setting.options.pictureHeight+'px'}"
          />
        </template> -->
          <a-list-item-meta :description="item[setting.options.content]?item[setting.options.content]:setting.options.content">
            <template #title>
              <a href="https://www.antdv.com/">
                {{ item[setting.options.title]?item[setting.options.title]:setting.options.title }}
              </a>
            </template>
            <template #avatar>
              <a-avatar
                :src="item[setting.options.headSrc]?item[setting.options.headSrc]:'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png'"
                 v-show="setting.options.needHead"
              />
            </template>
          </a-list-item-meta>
         
        </a-list-item>
      </template>
    </a-list>
  </div>
</template>
<script>
  import { defineComponent } from 'vue'
  import { Getsqlcolumns } from '@/api/report/api'
  export default defineComponent({
    props: ['setting'],
    data() {
      return {
        listData: [], //内容数据
        settingOptions: this.setting.options, //表头数据
        pageSize: 10,
        current: 1,
        tableKey: '',
      }
    },
    created() {
     
      var that = this
      Getsqlcolumns({
        DbId: that.setting.options.dbId,
        Sql: that.setting.options.sql,
        isdata: true,
      }).then((res) => {
        if (res.isSuccess) {
          this.listData = res.content.data
           console.log('listData', this.listData)
        } else {
          this.$message.error('sql语句语法错误' + res.message)
        }
      })
    },
  })
</script>
